<!--
 * @Author: yao
 * @Date: 2025-02-03 19:03:20
 * @LastEditTime: 2025-02-04 02:26:23
 * @LastEditors: yao
 * @Description: 
 * @FilePath: \jdev-web-el\src\Layouts\JHeader.vue
-->
<template>
  <div class="header">
    <div class="logo">JDev</div>
    <div class="menu flex items-center gap-5 ">
      <el-badge :value="12" class="item">
        <el-button class="font-size-5" circle :icon="Bell"></el-button>
      </el-badge>
      <el-button class="font-size-5" circle :icon="Setting"></el-button>
      <el-avatar class="border-1 border-solid border-#DCDFE6 cursor-pointer" :size="32"
        src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png" />
    </div>
  </div>
</template>

<script setup lang='ts'>
import {
  Bell, Setting
} from '@element-plus/icons-vue'
</script>

<style lang="scss" scoped>
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;

  .logo {}

  .menu {
    background: transparent;
  }
}
</style>